<template>
  <div class="page">
    <!-- 表单 -->

    <commpVxeTable
      :isCanWrap="true"
      :conditionBtnRow="true"
      :key="reCommpVxeTable"
      :config="dataTableConfig"
      :columns="columnsVxe"
      :formItem="formItem"
      @checkboxChange="checkboxChange"
      ref="administrativeOffice"
      @searchEvent="searchEvent"
      @resetEvent="resetEvent"
      >
      <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
        <a-form layout="inline">
            <a-form-item>
                <a-button class="blue-btn" @click="reviseClick(row)" icon="edit">办理</a-button>
            </a-form-item>
        </a-form>
      </template>
    </commpVxeTable>
    <flow-every-modal  ref="modal" @flow-refresh="$refs['xTable'].reset()">
      <!-- v-if="records.visbled" -->
      <template #default="records">
        <flow-check-table
          v-if="records.visbled"
          :sqsx="records.sqsx"
          :cyxpjl="records.cyxpjlList"
          :job="records.job"
          :sqsxid="records.sqsxid"
          :change="records.change"
          :nextNodeDbrList="records.nextNodeDbrList"
          :nextNode="records.nextNode"
        ></flow-check-table>
      </template>
    </flow-every-modal>
  </div>
</template>

<script>
// 待考评
import flowEveryModal from "../components/stayflow/stayflow-every-modal";
import { everydayPage } from "../api/dayPort";
import flowCheckTable from "@/views/everydayCheck/components/stayflow/stayflow-check-table";
import  commpVxeTable   from '@/components/commp-vxe-table/commp-vxe-table.vue'
import YchConstant from "@/api/YchConstant"; //接口模块配置项
export default {
  props: ["type"],
  components: { commpVxeTable, flowEveryModal, flowCheckTable },
  name: "LoadPage",

  data() {
    return {
      reCommpVxeTable: '',
      dataTableConfig: {
          api: YchConstant.SPZX_SPCY + "/flow-rckp/flowJobPage",
          rowId: 'id',
          paramet: {}
      },
      columnsVxe: [
        {
            type: 'checkbox',
            width: 60,
            fixed: 'left'
        },{
          field: "fqymc",
          title: "企业名称",
          width: 200,
        },{
          field: "fsxmc",
          title: "事项名称",
        },{
          field: "fslbh",
          title: "受理编号",
        },{
          field: "fslsj",
          title: "接收时间",
          width: "150",
        },
        {
          field: "fhjmc",
          title: "当前环节",
          width: 150,
        },{
          title: '操作',
          field: 'id',
          width: 100,
          titleInterval:true,
          slots: {
          // 使用插槽模板渲染
              header:'data2_header',
              default: 'operation_btn',
          },
        }
      ],
      formItem: [
        {
            label: '事项名称',
            model: 'fsxmc',
        },
        {
            label: '企业名称',
            model: 'fqymc',
        },
      ],
      idList: [],
    };
  },
  created() {},
  mounted() {

  },
  methods: {
    checkView(row) {
      //console.log(row);
      this.$refs.modal.handler(row.jobid);
    },
    // 勾选
    checkboxChange(val){
        //console.log('已选择',val)
        this.idList = []
        if(val.length){
            val.forEach(item => {
                this.idList.push(item.id)
            });
        }
    },
    // 搜索
    searchEvent(){
        this.dataTableConfig.paramet = {
            ...this.dataTableConfig.paramet,
        }
    },
    // 重置
    resetEvent(){
        //console.log('重置')
        this.reCommpVxeTable = Date.now()
        this.dataTableConfig.paramet = {
            ...this.dataTableConfig.paramet,
        }
    },
    reviseClick(row){
      //console.log(row)
      this.$nextTick(() => {
        this.$refs.modal.handler(row.jobid);
      })
    },
  },
};
</script>

<style lang="less" scoped>
// @import "../assets/table.less";
@import url("../assets/table.less");
</style>
